<template>
  <!--测试项目
  　　项目名称, 创建时间　
  　　
  -->

  <div class="container">


    <div>
      <el-button type="primary" @click="dialogFormVisible=true">添加项目</el-button>
    </div>


    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        label="编号"
        prop="id"
        width="180">
      </el-table-column>
      <el-table-column
        label="项目名称"
        prop="name"
        width="180">
      </el-table-column>

      <el-table-column
        label="创建时间"
        prop="createTime"
        width="180">
      </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleRouter(scope.$index, scope.row)">查看测试列表
          </el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.$index, scope.row)">删除
          </el-button>


        </template>
      </el-table-column>
    </el-table>


    <!-- Form -->
    <el-dialog title="添加项目" modal="false" append-to-body="true" :visible.sync="dialogFormVisible">
      <el-form :model="testProject">
        <el-form-item label="项目名称" :label-width="60">
          <el-input v-model="testProject.name" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="addPro">确 定</el-button>
      </div>
    </el-dialog>


  </div>


</template>

<script>
  import axios from "axios";
  import Urls from "../../../util/Urls";

  export default {
    name: "TestProject",
    data() {
      return {
        tableData: [],

        dialogFormVisible: false,
        testProject: {}
      }
    },
    methods: {
      handleRouter(index, row) {
        this.$router.push("/AutoTestList?projectId=" + row["id"]);
      },
      handleDelete(index, row) {
        this.$confirm('此操作将永久删除该工程, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {

          axios.post(Urls.urlRoot + "autoTest/project/del", {
            id: row["id"]
          }).then((res) => {

            this.getList();

          })
        }).catch(() => {

        });
      },

      addPro() {

        axios.post(Urls.urlRoot + "autoTest/project/add", this.testProject).then((res) => {
          this.getList();
        })


      },


      getList() {
        axios.post(Urls.urlRoot + "autoTest/project/all").then((res) => {
          this.tableData = res.data.data;
        })
      },


    },
    created() {

      this.getList();

    }

  }
</script>

<style scoped>

  .container {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    box-sizing: border-box;
    padding: 10px;
    position: fixed;
  }

  .v-modal {
    display: none;
  }

</style>
